<template>
  <div>
    <van-nav-bar title="ID:0494704" left-arrow @click-left="onClickLeft" @click-right="onClickRight"/>
    <van-cell title="个人设置" is-link url="/vant/mobile.html" />
    <van-cell title="账号设置" is-link url="/vant/mobile.html" />
    <van-cell title="推送设置" is-link url="/vant/mobile.html" />

    <van-cell title="我的勋章" is-link url="/vant/mobile.html" />
    <van-cell title="达人申请" is-link url="/vant/mobile.html" />
    <van-cell title="意见反馈" is-link url="/vant/mobile.html" />

    <van-cell title="关于我们" is-link url="/vant/mobile.html" />
    <van-cell title="给我们打分" is-link url="/vant/mobile.html" />
    <van-cell title="把烘培帮分享给朋友" is-link url="/vant/mobile.html" />

    <van-cell title="服务条款" is-link url="/vant/mobile.html" />
    <van-cell title="隐私政策" is-link url="/vant/mobile.html" />
    <van-cell title="隐私设置" is-link url="/vant/mobile.html" />
    <van-button class="btn1" type="warning">退出登录</van-button>
    <van-button class="btn2" type="warning">版本v5.9.0</van-button>
  </div>
</template>

<script>
export default {
     methods: {
    onClickLeft() {
      Toast('返回');
    },
    onClickRight() {
      Toast('按钮');
    },
  },
}
</script>

<style>
.van-icon:before {
    display: inline-block;
    color: #000;
}
.btn1 {
    position: relative;
    display: inline-block;
    box-sizing: border-box;
    height: 44px;
    margin: 0;
    padding: 0;
    font-size: 16px;
    line-height: 1.2;
    text-align: center;
    cursor: pointer;
    -webkit-transition: opacity .2s;
    transition: opacity .2s;
    -webkit-appearance: none;
    border-radius: 3px;
    width: 100%;
}
.btn2 {
    position: relative;
    display: inline-block;
    box-sizing: border-box;
    height: 44px;
    margin: 0;
    padding: 0;
    font-size: 16px;
    line-height: 1.2;
    text-align: center;
    cursor: pointer;
    -webkit-transition: opacity .2s;
    transition: opacity .2s;
    -webkit-appearance: none;
    border-radius: 3px;
    width: 100%;
    background-color: #fff;
    color: #000;
    border: 1px solid transparent;
}
</style>